<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div id="container">
    <mySpan />
</div>

<script src="https://unpkg.com/vue@next"></script>
<script type="text/javascript">

    const demoApp = {
        data() {
            return {
                baidu: 'http://www.baidu.com'
            }
        },
        mounted() {

        },
        methods: {}

    }

    const app = Vue.createApp(demoApp)

    /**
     * This will be converted to v-bind:[someattr] in in-DOM templates.
Unless you have a "someattr" property in your instance, your code won't work.
     **/
    app.component('myspan', { // 命名很奇怪，为什么myspan
        template: "<span>这是我的自定义span控件.</span>"
    })

    app.mount('#container')
</script>

</body>
</html>
